@import "global";
.cloud_l{
  width:10%;
  .cloud_name{
    width:100%;
    li{
      width:100%;
      line-height:0.5rem;
      height:0.5rem;
      font-size:16px;
      color: #333;
      font-weight:bold;
      text-align: center;
    }
    li:nth-child(2n+1){
      .bgColor(#e3f0fa);
    }
  }
}
.cloud_r{
  width:90%;
  .cloud_list{
    position: relative;
    li{
      line-height:0.5rem;
      height:0.5rem;
      font-size:16px;
      color: #333;
      padding-left:0.2rem;
      position: relative;
    }

    li:nth-child(2n+1){
      .bgColor(#e3f0fa);
    }

  }
  .cloud_list:hover{
    li:nth-child(1){
      z-index:2;
      background: none;
      color: #fff;
    }
  }
  .cloud_list:hover:before{
    content: '';
    width:100%;
    height:100%;
    position: absolute;
    background: url("../images/yun/cloud_bg.png") no-repeat;
    -webkit-background-size: contain;
    background-size: contain;
    z-index:1;
  }
}
.swiper_handle{
  text-align: center;
  width:1.24rem;
  height:0.38rem;
  line-height:0.38rem;
  border:1px solid #dcdcdc;
  -webkit-border-radius: 30px;
  -moz-border-radius: 30px;
  border-radius: 30px;
  margin:0.45rem auto;
  color: #dcdcdc;
  .swiper-button-next, .swiper-button-prev{
    position: relative;
    display: inline-block;
    background: none;
    vertical-align: middle;
    line-height:0.38rem;
    height:0.38rem;
    width:40%;
    margin:0;
    top:0;
    left:0;
    cursor: pointer;
    color: #dcdcdc;
    background: #fff;
  }
}
//产品优势
.pro_advantage{
  .bgColor(#f5f5f5);
  padding:0.4rem 0;
}
.advantage_list{
  overflow: hidden;
  .advantage_item{
    min-height:3.95rem;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding-top:0.5rem;
    width:33.33%;
    float: left;
    text-align: center;
    border-right:1px solid #dcdcdc;
    border-bottom:1px solid #dcdcdc;
    .advantage_icon{
      width:1rem;
      height:1rem;
      line-height:1rem;
      text-align: center;
      background: #1a81d2;
      color: #fff;
      -webkit-border-radius: 50%;
      -moz-border-radius: 50%;
      border-radius: 50%;
      margin:0 auto 0.2rem;
      -webkit-box-shadow: 0 5px 15px rgba(26,129,210,0.2) ;
      -moz-box-shadow: 0 5px 15px  rgba(26,129,210,0.2) ;
      box-shadow: 0 5px 15px  rgba(26,129,210,0.2) ;
      .iconfont{
        font-size:46px;
      }
    }
    .advantage_name{
      display: inline-block;
      padding:0.15rem 0.24rem;
      border-bottom:1px solid #dcdcdc;
      position: relative;
    }
    .advantage_name:before{
      content: '';
      width:0.2rem;
      height:0.03rem;
      background: #1a81d2;
      position: absolute;
      left: 50%;
      bottom:-0.015rem;
      margin-left:-0.1rem;
    }
    .advantage_en{
      font-size:14px;
      color: #aaa;
      line-height:0.4rem;
    }
    .advantage_dec{
      padding:0.1rem 0;
      font-size:14px;
      line-height:0.3rem;
    }
  }
  .advantage_item:nth-child(3),.advantage_item:nth-child(6){
    border-right:none;
  }
  .advantage_item:nth-child(4), .advantage_item:nth-child(5), .advantage_item:nth-child(6){
    border-bottom:none;
  }

  .advantage_item.active{
    .advantage_icon{
      .bgColor(#fbc111);
      -webkit-box-shadow: 0 5px 15px rgba(251,193,17,0.2) ;
      -moz-box-shadow: 0 5px 15px rgba(251,193,17,0.2);
      box-shadow: 0 5px 15px rgba(251,193,17,0.2);
    }
    .advantage_name:before{
      background-color: #fbc111;
    }
  }
}


/*媒体查询*/
@media (min-width: 1200px) {
  .container {
    width: 1200px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .container {
    width: 970px;
  }

}

@media (min-width: 768px) and (max-width: 991px) {
  body {
    font-size: 14px;
  }

  .container {
    width: 750px;
  }

  .cloud_r .cloud_list li{
    font-size:14px;
  }
}

@media (max-width: 767px) {
  .container {
    width: 100%;
    padding: 0 0.1rem;
  }
  .advantage_list .advantage_item{
    width:88%;
    float: none;
    margin:0 auto 0.1rem;
    border:1px solid #dcdcdc !important;
  }
}


@media (min-width: 480px) and (max-width: 767px) {
  body {
    font-size: 13px;
  }


}

@media (max-width: 479px) {
  body {
    font-size: 12px;
  }
  .about_title{
    padding-top:0.2rem;
  }
  .cloud_l{
    width:23%;
  }
  .cloud_r{
    width:77%;
    font-size:13px;
  }
  .cloud_l .cloud_name li{
    font-size:13px;
  }
  .cloud_r .cloud_list li{
    font-size:13px;
  }
}